import { createApp } from 'vue'
// import './style.css'
import './assets/css/index.css'
import './assets/css/backstageIndex.css'
import App from './App.vue'
import router from './router/router.js'
import 'element-plus/dist/index.css'
import 'element-plus/theme-chalk/dark/css-vars.css'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import _axios from '/src/utils/myAxios.js'
import { useMenuStore } from '@/store/menu.js'
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

const app = createApp(App)
app.use(ElementPlus, {
  locale: zhCn,
})
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
app.use(pinia)
const menuStore = useMenuStore()
async function addRouterchildren(res: any) {
  for (let i = 0; i < res.length; i++) {
    let child = res[i]
    if (child.children.length > 0 || child.childern !== null) {
      addRouterchildren(child.children)
    }
    if (child.component) {
      menuStore.routers.push({
        path: child.path,
        component: () => import(`@/views/backstage/${child.component}.vue`)
      });
    }
  }
}
async function getRouter() {
  let res = await _axios.get("/api/menu/getRouters")
  menuStore.menu = res.data.data
  if (res.data.code === 200) {
    addRouterchildren(res.data.data)
    menuStore.routers.forEach((r: any) => {
      router.addRoute("backstage", r)
    })
  }
}
async function initApp() {
  await getRouter()
  router.isReady();
  app.use(router)
  app.mount('#app')
}
initApp()
localStorage.removeItem("vueuse-color-scheme")
